import { SelectNode } from "@/api/dept/DeptModel";
import { EditType, Title } from "@/type/BaseEnum"
import { DailogModel } from "@/type/BaseType"
import { ElForm } from 'element-plus';
import { ref } from 'vue'
import userInstance from '@/hooks/userInstance'
import { AddUserModel } from "@/api/user/userModel";

export default function addAndEdit(dailog:DailogModel,onShow,onClose,formData,emit) {
    // 全局属性
    const { global } = userInstance()
    // 表单的ref属性
    const formDataRef = ref<InstanceType<typeof ElForm>>()
    // 弹框确定
    const confirm = () => {
        formDataRef.value?.validate(valid => {
            console.log(valid)
            if(valid) {
                emit('save',formData)
                // 关闭弹窗
                onClose()
            }
        })
    }
    // 展示弹窗
    const show = (type: string, row: AddUserModel) => {
        console.log(row)
        // 设置弹框的属性
        dailog.height = 200
        type === EditType.ADD ? dailog.title = Title.ADD : dailog.title = Title.EDIT
        // 显示弹窗
        onShow()
        // 清空表单
        global.$restForm(formDataRef.value,formData)
        // 如果是编辑，要把编辑的数据复制到表单绑定的formData里面
        if(type === EditType.EDIT) {
            // 回显数据 把row复制到dialogModel
            global.$objCopy(row,formData)
        }
        // 设置是新增还是编辑
        formData.type = type
    }
    // 选中上级的数据
    const select = (node:SelectNode) => {
        console.log('父组件取到值===', node)
        formData.deptId = node.id
        formData.deptName = node.name
        console.log('formData===',formData)
    }
    return {
        confirm,
        show,
        formDataRef,
        select
    }
}